<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>overflow溢出</title>
    <style>
        /*
        overflow:属性规定当内容溢出元素框时发生的事情。
          可选值:
            visible：内容不会被修剪，超出部分会显示在元素框之外
            hidden：内容会被修剪，超出部分直接被截取
            scroll ：内容会被修剪，超出部分，浏览器会以滚动条的方式显示,但无论是否子元素内容超出，都会显示滚动条
            auto:如果内容被修剪，则浏览器会自动显示滚动条以显示剩余内容，如果不超出，则不会显示滚动条
        */
        .box {
            width: 200px;
            height: 200px;
            background-color: #bfa;
            overflow: scroll;
        }
        .box1 {
            width: 200px;
            height: 300px;
            background-color: pink;
        }
    </style>
</head>

<body>
    <div class="box">
        <div class="box1">时间永是流驶，街市依旧太平，有限的几个生命，在中国是不算什么的，至多，不过供无恶意的闲人以饭后的谈资，或者给有恶意的闲人作“流言”的种子。至于此外的深的意义，我总觉得很寥寥，因为这实在不过是徒手的请愿。人类的血战前行的历史，正如煤的形成，当时用大量的木材，结果却只是一小块，但请愿是不在其中的，更何况是徒手。</div>
    </div>
</body>

</html>